<template>
  <div class="iconList">
    <div v-for="item in iconList" :key="item" class="iconItem" @click="selectIcon(item)">
      <img :src="'../../assets/images/mapIcon/' + item + '.png'" />
    </div>
  </div>
</template>

<script>
export default {
  name: 'MapIcon',
  data() {
    return {
      nationvalue: '',
      iconList: []
    }
  },
  created() {
    this.getInconList()
  },
  methods: {
    getInconList() {
      for (var i = 1; i <= 48; i++) {
        const aaa = i.toString()
        this.iconList.push(aaa)
      }
    },
    selectIcon(value) {
      this.$emit('selectIcon', value)
    }
  }
}
</script>
<style lang="scss" scoped>
.iconList {
    display: flex;
    flex-wrap: wrap;
    img {
      width: 35px;
      height: 35px;
      margin: 3px 9px;
    }
}
</style>
